Conditions | 20 |
Total Lines | 138 |
Code Lines | 98 |
Lines | 0 |
Ratio | 0 % |
Changes | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
Complex classes like workflow.js ➔ create_dialog often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.
Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.
1 | $(document).ready(function() { |
||
168 | function create_dialog(control, title, url) { |
||
169 | if ($('.midcom-workflow-dialog').is(':visible')) { |
||
170 | $('body').addClass('midcom-workflow-switching'); |
||
171 | $('.midcom-workflow-dialog .ui-dialog-content').dialog('close'); |
||
172 | } |
||
173 | |||
174 | var dialog, iframe, spinner, is_scrolling, |
||
175 | config = { |
||
176 | dialogClass: 'midcom-workflow-dialog', |
||
177 | buttons: [], |
||
178 | title: title, |
||
179 | height: 590, |
||
180 | width: 800, |
||
181 | close: function() { |
||
182 | control.removeClass('active'); |
||
183 | iframe.css('visibility', 'hidden'); |
||
184 | // second clause is an IE11 workaround |
||
185 | if (iframe[0].contentWindow && iframe[0].contentWindow.hasOwnProperty('stop')) { |
||
186 | iframe[0].contentWindow.stop(); |
||
187 | } |
||
188 | if ($('body').hasClass('midcom-workflow-switching')) { |
||
189 | $('body').removeClass('midcom-workflow-switching'); |
||
190 | } else { |
||
191 | $('body').removeClass('midcom-workflow-active'); |
||
192 | } |
||
193 | }, |
||
194 | open: function() { |
||
195 | dialog.closest('.ui-dialog').focus(); |
||
196 | $('body').addClass('midcom-workflow-active'); |
||
197 | }}; |
||
198 | |||
199 | if (control.data('dialog-cancel-label')) { |
||
200 | config.buttons.push({ |
||
201 | text: control.data('dialog-cancel-label'), |
||
202 | click: function() { |
||
203 | $(this).dialog( "close" ); |
||
204 | } |
||
205 | }); |
||
206 | } |
||
207 | |||
208 | // Workaround for jqueryui incompatibility between position widget & css fixed position |
||
209 | function keep_dialog_fixed () { |
||
210 | var ui_dialog = dialog.closest('.ui-dialog'), |
||
211 | viewport_position = ui_dialog[0].getBoundingClientRect(); |
||
212 | |||
213 | window.clearTimeout(is_scrolling); |
||
214 | |||
215 | ui_dialog.css({ |
||
216 | position: 'fixed', |
||
217 | top: viewport_position.top + 'px', |
||
218 | left: viewport_position.left + 'px' |
||
219 | }); |
||
220 | |||
221 | is_scrolling = setTimeout(function() { |
||
222 | ui_dialog.css({ |
||
223 | position: 'absolute', |
||
224 | top: ui_dialog.offset().top + 'px', |
||
225 | left: ui_dialog.offset().left + 'px' |
||
226 | }); |
||
227 | }, 500); |
||
228 | } |
||
229 | |||
230 | if ($('#midcom-dialog').length > 0) { |
||
231 | dialog = $('#midcom-dialog'); |
||
232 | iframe = dialog.find('> iframe'); |
||
233 | spinner = dialog.find('> .spinner').show(); |
||
234 | config.height = dialog.dialog('option', 'height'); |
||
235 | config.width = dialog.dialog('option', 'width'); |
||
236 | if ( config.width > window.innerWidth |
||
237 | || config.height > window.innerHeight) { |
||
238 | config.position = { my: "center", at: "center", of: window, collision: 'flipfit' }; |
||
239 | } |
||
240 | } else { |
||
241 | spinner = $('<span class="spinner">' + get_spinner_template() + '</span>'); |
||
242 | iframe = $('<iframe name="datamanager-dialog"' |
||
243 | + ' frameborder="0"' |
||
244 | + ' width="100%"' |
||
245 | + ' height="100%"' |
||
246 | + ' scrolling="auto"></iframe>') |
||
247 | .on('load', function() { |
||
248 | // this is only here as fallback in case dialog.js doesn't run for whatever reason |
||
249 | spinner.hide(); |
||
250 | this.style.visibility = 'visible'; |
||
251 | }); |
||
252 | |||
253 | dialog = $('<div id="midcom-dialog" class="has-iframe"></div>') |
||
254 | .append(spinner) |
||
255 | .append(iframe) |
||
256 | .on('dialogcreate', function() { |
||
257 | var maximized = false, |
||
258 | saved_options = {}; |
||
259 | $(this).prevAll('.ui-dialog-titlebar').on('dblclick', function() { |
||
260 | if (!maximized) { |
||
261 | saved_options.position = dialog.dialog('option', 'position'); |
||
262 | saved_options.width = dialog.dialog('option', 'width'); |
||
263 | saved_options.height = dialog.dialog('option', 'height'); |
||
264 | dialog.dialog('option', { |
||
265 | width: '99%', |
||
266 | height: $(window).height(), |
||
267 | position: {my: 'center top', at: 'center top', of: window} |
||
268 | }); |
||
269 | maximized = true; |
||
270 | } else { |
||
271 | dialog.dialog('option', { |
||
272 | height: saved_options.height, |
||
273 | width: saved_options.width, |
||
274 | position: saved_options.position |
||
275 | }); |
||
276 | maximized = false; |
||
277 | } |
||
278 | }); |
||
279 | }) |
||
280 | .on('dialogopen', function() { |
||
281 | window.addEventListener('scroll', keep_dialog_fixed, false); |
||
282 | }) |
||
283 | .on('dialogclose', function() { |
||
284 | window.removeEventListener('scroll', keep_dialog_fixed, false); |
||
285 | }) |
||
286 | .appendTo($('body')); |
||
287 | } |
||
288 | |||
289 | config.height = Math.min(config.height, window.innerHeight); |
||
290 | config.width = Math.min(config.width, window.innerHeight); |
||
291 | |||
292 | if (url) { |
||
293 | iframe.attr('src', url); |
||
294 | } |
||
295 | |||
296 | control.addClass('active'); |
||
297 | if ( control.parent().attr('role') === 'gridcell' |
||
298 | && control.closest('.jqgrow').hasClass('ui-state-highlight') === false) { |
||
299 | //todo: find out why the click doesn't bubble automatically |
||
300 | control.parent().trigger('click'); |
||
301 | } |
||
302 | |||
303 | make_dialog(dialog, config); |
||
304 | dialog.dialog("instance").uiDialog.draggable("option", "containment", false); |
||
305 | } |
||
306 | |||
339 |